import React, {useEffect, useState} from "react";
import {InputItem, List, Modal, Picker, TextareaItem, Toast} from "antd-mobile";
import UserMsg from "../../outUser/userMsg/UserMsg";
import {useHistory} from "react-router-dom";
import Btn from "../../../components/btn/Btn";
import './Money.less';
import http from "../../../model/http";
import {sendMsg} from "../../../model/code";

const Item = List.Item;

function Money() {
  const history = useHistory(), {outUser,item} = history.location.state;
  const  [card,setCard] = useState({}),
      [money,setMoney] = useState(0), //报价
      [conut1,setCount1] = useState(0), //余额
      [conut2,setCount2] = useState(0), //积分
      [memo,setMemo] = useState(''),
      [doctor,setDoctor] = useState([item.expert_id||-1]),
      [doctorList,setDoctorList] = useState([]);


  useEffect(()=>{
    (async ()=>{
      const _doctor = await http.post('/customer/doctorList');
      const _card = await http.post('/bill/billInit',{customerCrmId:outUser.customerCrmId});
      setDoctorList(_doctor.data.map(i=>{i.label=i.name;i.value=i.id;return i}));
      setCard(_card);
    })()


// eslint-disable-next-line
  },[])


  const submit = ()=>{
    //realPrice=cardMoney=&totalPoints=memo=customerName=trname=
    if(doctor[0]<0){Toast.fail('请选择医生');return};
    if(money<=0){Toast.fail('请输入报价');return};

    Modal.alert('提示', '确认开单', [
      { text: '取消'},
      { text: '开单', onPress: async ()=>{
          const order = await http.post('/bill/subbill',{
            customerCrmId:outUser.customerCrmId,
            expertId:doctor[0],trid:item.trid,
            realPrice:money,cardMoney:conut1,totalPoints:conut2,
            memo:memo,customerName:outUser.customerName,
            trname:item.displayName
          });

          sendMsg(order.jumpUrl,'订单信息',`${order.mangerName} 已为您创建订单，请支付`);
          console.log(order);
        }},
    ])

  };

  return (
      <div className='v-goods-momey'>
        <UserMsg msg={outUser} />

        <List className='g-mb10 g-bg-f g-bdrs12 g-ov'>
          <Item wrap extra={item.displayName}>选择项目</Item>
          <Item extra={item.price+'元'}>项目原价</Item>
          <Item extra={item.lowestPrice+'元'}>红线价格</Item>
          <Picker data={doctorList} value={doctor} cols={1} onOk={setDoctor}>
            <Item arrow='horizontal'>指定专家</Item>
          </Picker>

          <InputItem type='number' value={money||''} onChange={v=>{setMoney(v-0)}}  extra='元' moneyKeyboardAlign='right'>实际报价</InputItem>
          <InputItem type='number' extra='元'
                     value={conut1||''}
                     onChange={v=>{setCount1(v-0)}}
                     moneyKeyboardAlign='right'
                     placeholder={`最多使用${card.cardbalance||0}`}
                     disabled={card.cardbalance<=0}>使用卡</InputItem>
          <InputItem type='number' extra='点'
                     value={conut2||''}
                     onChange={v=>{setCount2(v-0)}}
                     moneyKeyboardAlign='right'
                     placeholder={`最多使用${card.points||0}`}
                     disabled={card.points<=0}>使用积分</InputItem>

        </List>

        <List className='g-mb10 g-bg-f g-bdrs12 g-ov'>
          <TextareaItem value={memo} onChange={setMemo} rows={5} count={100} placeholder='请输入备注信息...'/>
        </List>

        <div className="g-w100 g-flex g-x-between g-y-center g-bg-f g-bdrs12 g-p10 g-box red g-mb10"
             style={{height:50,fontSize:18}}>
          <span className='v-money g-rel'>合计</span>
          <span>{money?((money*100)-(conut1*100)-(conut2*100))/100:0}</span>
        </div>

        <Btn type='primary' onClick={submit}>确认并发送给顾客</Btn>
      </div>
  )
}

export default Money;